<template>
  <div>
    <p>原来的样子{{ msg }}</p>
    <!-- 过滤器的使用
    语法：{{ value | fliterName }} -->
    <p>{{ msg | reverse }}</p>
    <p :title="msg | toUpper">鼠标长停</p>
  </div>
</template>

<script>
export default {
  data() {
    return {
      msg: "Hello world",
    };
  },
  // 方式二：在某个vue文件的配置对象中添加filters节点，定义局部过滤器，只能在当前vue文件使用
  filters: {
    toUpper: (val) => val.toUpperCase(),
  },
};
</script>

<style>
</style>